@extends("ogreencard/layout/layout")
@section("h1","卡券管理")
@section("h2","卡券列表")
@section("content")
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">


                <div class="layui-card-body ">
                    <form class="layui-form layui-col-space5" action="" >
                        <input type="hidden" name="_token" id="token" value="{{csrf_token()}}">

                        <div class="layui-inline layui-show-xs-block">
                            <select name="order" id="" class="layui-select">
                                <option value="-1">使用状态</option>
                                <option value="1" @if($params['order'] == 1) selected @endif>已使用</option>
                                <option value="0" @if($params['order'] == 0) selected @endif>未使用</option>
                                <option value="2" @if($params['order'] == 2) selected @endif>已作废</option>
                            </select>
                        </div>

                        <div class="layui-inline layui-show-xs-block">
                            <input class="layui-input"  autocomplete="off" placeholder="卡号" name="code" value="{{$params['code']}}">
                        </div>

                        <div class="layui-inline layui-show-xs-block">
                            <input class="layui-input"  autocomplete="off" placeholder="密码" name="pwd" value="{{$params['pwd']}}">
                        </div>

                        <div class="layui-inline layui-show-xs-block">
                            <button class="layui-btn"><i class="layui-icon">&#xe615;</i></button>
                        </div>


                        {{--批量删除--}}
                        <div class="layui-inline" style="float: right;">

                            <div class="layui-inline layui-show-xs-block">
                                <input class="layui-input"   placeholder="最小卡号ID" id="minId">
                            </div>

                            <div class="layui-inline layui-show-xs-block">
                                <input class="layui-input"   placeholder="最大卡号ID" id="maxId">
                            </div>

                            <div class="layui-inline layui-show-xs-block">
                                <span class="layui-btn layui-btn-danger" onclick="member_del_all()">批量删除</span>
                            </div>
                        </div>
                    </form>


                </div>


                <div class="layui-card-header">
                    <button class="layui-btn layui-btn-danger" onclick="disableAll()"><i class="layui-icon"></i>批量作废</button>
                    @if($admin->role<2)
                    <a href="./importCard" class="layui-btn btn-primary"> <i class="layui-icon">&#xe67c;</i>导入卡券</a>
                    @endif
                </div>

                <div class="layui-card-body layui-table-body layui-table-main">
                    <table class="layui-table layui-form">
                        <thead>
                        <tr>
                            <th>
                                <input type="checkbox" lay-filter="checkall" name="" lay-skin="primary">
                            </th>
                            <th>ID</th>
                            <th>卡号</th>
                            <th>密码</th>
                            <th>积分数</th>
                            <th>类型</th>
                            <th>使用时间</th>
                            <th>添加时间</th>
                            <th>作废原因</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($cards as $card)
                            <tr>
                                <td>
                                    @if(!$card->used_at && !$card->deleted_at)
                                    <input type="checkbox" name="id" value="{{$card->card_id}}"   lay-skin="primary">
                                    @endif
                                </td>
                                <td>{{$card->card_id}}</td>
                                <td>{{$card->code}}</td>
                                <td>{{$card->pwd}}</td>
                                <td>{{$card->price}}</td>
                                <td>{{$card->type==1?'中行':'内部'}}</td>
                                <td>
                                    @if($card->used_at)
                                    <a href="orders?id={{$card->order_id}}" style="color:blue;">{{$card->used_at}}</a>
                                    @endif
                                </td>
                                <td>{{$card->created_at}}</td>
                                <td>{{$card->note}}</td>
                                <td class="td-manage">
                                    @if(!$card->used_at && !$card->deleted_at)

                                        <span class="layui-btn layui-btn-sm layui-btn-normal" onclick="member_disable(this,{{$card->card_id}})">作废</span>
                                        <span class="layui-btn layui-btn-sm layui-btn-danger" onclick="member_del({{$card->card_id}})">删除</span>
                                    @endif
                                </td>
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>

                <div class="layui-card-body ">
                    <div class="page">
                        {{ $cards->appends($params)->links() }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    layui.use(['laydate','form','upload'], function(){
        var laydate = layui.laydate;
        var  form = layui.form;
        var upload = layui.upload;

        var $ = layui.jquery;
        // 监听全选
        form.on('checkbox(checkall)', function(data){

            if(data.elem.checked){
                $('tbody input').prop('checked',true);
            }else{
                $('tbody input').prop('checked',false);
            }
            form.render('checkbox');
        });

        upload.render({
            elem:"#upload",
            url:"./importCard",
            accept:"file",
            acceptMime:'.xls,.xlsx',
            data:{_token:$("#token").val()},
            done:function(res){

                if(res.code == 200)
                {
                    layer.msg(res.msg,{icon:1,time:2000},function()
                    {
                        if(res.code == 200)
                        {
                            location.href = "./cards";
                        }
                    });

                }else{
                    layer.msg(res.msg,{icon:7},function(){

                    })
                }
            },
            error:function(){

            }
        })

    });

    function member_del_all(){
        var maxId = $('#maxId').val();
        var minId = $('#minId').val();

        if(!maxId || !minId){
            return layer.msg('请填写合格的ID',{icon:7},function(){

            });
        }
        member_del_action(minId,maxId,'');
    }
    function member_del(id){
        member_del_action(0,0,id);
    }

    function member_del_action(min,max,ids){

        layer.confirm('确定删除吗?', {icon: 3, title:'提示'}, function(index){
            //do something
            layer.close(index);
            $ = layui.jquery;
            $.get({
                url:'./cardDel?min='+min+'&max='+max+'&ids='+ids,
                success:function(){
                    layer.msg('已删除!',{icon:1,time:1000},function()
                    {
                        location.reload();
                    });
                }
            });
        });
    }

    /*用户-作废*/
    function member_disable(obj,id){

        layer.prompt({
            formType: 2,
            value: '',
            title: '请说明作废理由',
            area: ['300px', '150px'] //自定义文本域宽高
        }, function(value, index, elem){
            $ = layui.jquery;
            $.get({
                url:'./cardDisable?id='+id+"&note="+value,
                success:function(){
                    //$(obj).parents("tr").remove();
                    layer.msg('已删除!',{icon:1,time:1000},function()
                    {
                        location.reload();
                    });
                }
            });
            //layer.close(index);
        });
    }



    function disableAll (argument) {
        var ids = [];

        // 获取选中的id
        $('tbody input').each(function(index, el) {
            if($(this).prop('checked'))
            {
                ids.push($(this).val())
            }
        });
        if(ids.length ==0) return;
        layer.prompt({
            formType: 2,
            value: '',
            title: '请说明作废理由',
            area: ['300px', '150px'] //自定义文本域宽高
        }, function(value, index, elem){
            $ = layui.jquery;

            $.get({
                url:'./cardDisable?note='+value+'&id='+ids.join(","),
                success:function(){
                    layer.msg('已作废!',{icon:1,time:1000},function()
                    {
                        location.reload();
                    });
                }
            });
        });
    }
</script>

@endsection